<br/>
<style>
    .active {
        background-color: deeppink;
        color: #fff !important;
    }
</style>

<div>
    <!--判断是不是首页-->
    <% if (!isFirstPage) { %>
    <span class="prePage">
        <a href="?p=<%= 1 %>">首页</a>
        <a title="上一页" href="?p=<%= page - 1 %>">上一页</a>
    </span>
    <% } %>

    <% if(Math.ceil(total / 3) < 5){ %>
    <% for(var i = 0;i < Math.ceil(total / 3);i++){ %>
    <span class="page">
        <a href="?p=<%= i + 1 %>"><%= i + 1 %></a>
    </span>
    <% } %>

    <% }else{ %>
    <% if(page < 3){ %>
    <% for(var i = 0;i < 5;i++){ %>
    <span class="page">
            <a href="?p=<%= i + 1 %>"><%= i + 1 %></a>
         </span>
    <% } %>

    <% }else if(page > Math.ceil(total / 3) - 2){ %>
    <% for(var i = Math.ceil(total / 3) - 5;i < Math.ceil(total / 3);i++){ %>
    <span class="page">
            <a href="?p=<%= i + 1 %>"><%= i + 1 %></a>
         </span>
    <% } %>
    <% }else{ %>
    <% for(var i = (page - 3);i < (page + 2);i++){ %>
    <span class="page">
            <a href="?p=<%= i + 1 %>"><%= i + 1 %></a>
         </span>
    <% } %>
    <% } %>
    <% } %>
    <!--判断是不是尾页-->
    <% if (!isLastPage) { %>
    <span class="nextPage">
        <a title="下一页" href="?p=<%= page + 1 %>">下一页</a>
         <a href="?p=<%= Math.ceil(total / 3) %>">尾页</a>
    </span>
    <% } %>
</div>
<script>
    $(function () {
        if (Math.ceil(<%= total / 3 %>) < 5) {
            $('.page a').eq(<%= page - 1 %>).addClass('active');
        } else {
            if (<%= (page < 3) %>) {
                $('.page a').eq(<%= page - 1 %>).addClass('active');
            } else if (<%= page > Math.ceil(total / 3) - 2 %>) {
                $('.page a').eq(<%= page - Math.ceil(total / 3) + 4 %>).addClass('active');
            } else {
                $('.page a').eq(2).addClass('active');
            }
        }
    });
</script>
